<template>
	<view class="">
		<scroll-view scroll-y="true" style="width: 100vw;height: 100vh;" @click="sendMsg">
			<view class="content">
				<view class="list" @click="gowallet">
					<!-- <img src="../../static/img/wallet.png" alt="" class="icon"> -->
					<img src="../../static/img/1.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.wallet')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click="gobridge">
					<!-- <img src="../../static/img/icon2.png" alt="" class="icon"> -->
					<img src="../../static/img/2.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.CrossChainBridge')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				
				<view class="list" @click="gofinan">
					<!-- <img src="../../static/img/icon4.png" alt="" class="icon"> -->
					<img src="../../static/img/3.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.CrossChainfinancing')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click="goarbitrageAI">
					<!-- <img src="../../static/img/icon5.png" alt="" class="icon"> -->
					<img src="../../static/img/4.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.BlockchainArbitrage')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click="godao">
					<!-- <img src="../../static/img/icon3.png" alt="" class="icon"> -->
					<img src="../../static/img/5.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.DAO')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click="gomine">
					<!-- <img src="../../static/img/icon6.png" alt="" class="icon"> -->
					<img src="../../static/img/6.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.IndividualCenter')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click="goutile">
					<!-- <img src="../../static/img/icon7.png" alt="" class="icon"> -->
					<img src="../../static/img/7.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.ApplicationTool')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<!-- <view class="list2" @click.stop="show2 = !show2">
					<view class="list">
						<img src="../../static/img/8.png" alt="" class="icon">
						<view class="title">{{$t('sidebar.SocialMedia')}}</view>
						<img src="../../static/img/more.png" alt="" class="more">
					</view>
					<view style="margin-left: 50rpx;" v-if="show2">
						<view class="list" @click.stop="openurl(0)">
							<img src="../../static/img/i1.png" alt="" class="icon">
							<view class="title">{{$t('socialize.twitter')}}</view>
						</view>
						<view class="list" @click.stop="openurl(1)">
							<img src="../../static/img/i2.png" alt="" class="icon">
							<view class="title">{{$t('socialize.Googlemail')}}</view>
						</view>
						<view class="list" @click.stop="openurl(2)">
							<img src="../../static/img/i3.png" alt="" class="icon">
							<view class="title">{{$t('socialize.YouTube')}}</view>
						</view>
						<view class="list" @click.stop="openurl(3)">
							<img src="../../static/img/i4.png" alt="" class="icon">
							<view class="title">{{$t('socialize.Discord')}}</view>
						</view>
						<view class="list" @click.stop="openurl(4)">
							<img src="../../static/img/i5.png" alt="" class="icon">
							<view class="title">{{$t('socialize.Telegram')}}</view>
						</view>
						<view class="list" @click.stop="openurl(5)">
							<img src="../../static/img/i6.png" alt="" class="icon">
							<view class="title">{{$t('socialize.Instagram')}}</view>
						</view>
					</view>
				</view> -->
				<view class="list" @click.stop="goiframe('api/website')">
					<img src="../../static/img/8.png" alt="" class="icon">
					<view class="title">{{$t('first.title111')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<view class="list" @click.stop="goiframe('api/whitepdf')">
					<img src="../../static/img/9.png" alt="" class="icon">
					<view class="title">{{$t('first.title136')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view>
				<!-- <view class="list" @click.stop="loginout">
					<img src="../../static/img/10.png" alt="" class="icon">
					<view class="title">{{$t('sidebar.ExitAccount')}}</view>
					<img src="../../static/img/more.png" alt="" class="more">
				</view> -->
				<view class="list2">
					<view class="list" @click.stop="show3 = !show3">
						<!-- <img src="../../static/img/icon10.png" alt="" class="icon"> -->
						<img src="../../static/img/11.png" alt="" class="icon">
						<view class="title">{{$t('sidebar.language')}}</view>
						<img v-if="$i18n.locale == 'ft'" src="../../static/img/zh.png" alt="" class="more">
						<img v-if="$i18n.locale == 'en'" src="../../static/img/en.png" alt="" class="more">
						<img v-if="$i18n.locale == 'jp'" src="../../static/img/rb.png" alt="" class="more">
						<img v-if="$i18n.locale == 'ko'" src="../../static/img/hg.png" alt="" class="more">
						<img v-if="$i18n.locale == 'zh'" src="../../static/img/zh.png" alt="" class="more">
					</view>
					<view  style="display: flex;justify-content: flex-end;padding-right: 40rpx;">
						<view class="langBox" v-if="show3">
							<view @click.stop="lang('en')" class="list">
								<img src="../../static/img/en.png" alt="">
								<text>English</text>
							</view>
							<view @click.stop="lang('ft')" class="list">
								<img src="../../static/img/zh.png" alt="">
								<text>港澳繁體</text>
							</view>
							<view @click.stop="lang('zh')" class="list">
								<img src="../../static/img/zh.png" alt="">
								<text>中文简体</text>
							</view>
							<view @click.stop="lang('jp')" class="list">
								<img src="../../static/img/rb.png" alt="">
								<text>にほんご</text>
							</view>
							<view @click.stop="lang('ko')" class="list">
								<img src="../../static/img/hg.png" alt="">
								<text>한국어</text>
							</view>
						</view>
					</view>
				</view>
				<u-popup :show="show" :mode="'center'">
					<view class="popupcon">
						<image class="icon" src="../../static/tian/tanhao.png" mode=""></image>
						<view class="titles">{{$t('first.title88')}}?</view>
						<view class="btns">
							<view class="btn" @click="show=false">No</view>
							<view class="btn" style="background-color: #222;color: #fff;margin-left: 10rpx;"
								@click="logout">Yes
							</view>
						</view>
					</view>
				</u-popup>
				<u-popup :show="show4" :mode="'center'">
					<view class="popupcon1">
						<view class="mask_title">{{$t('wallet.enterPassword')}}</view>
						<u--input class="uInput" :placeholder="$t('wallet.Please') +  $t('wallet.enterPassword')"
							border="surround" v-model="nums_d" type="password"></u--input>
						<view class="mask_btn">
							<view @click='show4 = false'>cancel</view>
							<view @click='gobackups()'>OK</view>
						</view>
					</view>
				</u-popup>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		domain
	} from '../../config/domain.js'
	export default {
		data() {
			return {
				show: false,
				show2: false,
				show3: false,
				show4: false,
				nums_d:''
			}
		},
		methods: {
			sendMsg() {
				//子传父
				this.$emit('getMsg', "我是子");
			},
			gowallet() {
				uni.navigateTo({
					url: '/pages/index/index'
				})
			},
			godao() {
				uni.navigateTo({
					url: '/pages/dao/dao'
				})
			},
			gobridge() {
				uni.navigateTo({
					url: '/pages/index/bridge'
				})
			},
			gofinan() {
				uni.navigateTo({
					url: '/pages/index/finan'
				})
			},
			goarbitrageAI() {
				uni.navigateTo({
					url: '/pages/arbitrageAI/arbitrageAI'
				})
			},
			gomine() {
				uni.navigateTo({
					url: '/pages/user/mine'
				})
			},
			goutile() {
				uni.navigateTo({
					url: '/pages/utile/utile'
				})
			},
			goiframe(e){
				window.open(domain+e+'?lang='+uni.getStorageSync('lang'))
				// uni.navigateTo({
				// 	url:'/pages/index/iframe?url=' + e
				// })
			},
			gobackups(){
				if (!this.nums_d) {
					uni.showToast({
						icon:'none',
						title:this.$t('wallet.Please') + this.$t('wallet.enterPassword')
					}); 
					return false;
				}
				let url = domain + 'api/new_checkPassword';
				let mytype = 'POST';
				let userinfo = uni.getStorageSync('userinfo');
				let data = {
					password:this.nums_d
				};
				uni.request({
					url,
					method: mytype,
					data,
					header: {
						'content-type': 'application/x-www-form-urlencoded' ,//自定义请求头信息
						'Lang':uni.getStorageSync('lang'),
						'AUTHORIZATION': userinfo.token,
					},
					success: res => {
						if(res.data.code==0){
							uni.showToast({
								icon:'none',
								title:res.data.msg
							}); 
						}else{
							this.nums_d = ''
							this.show4 = false
							uni.navigateTo({
								url: '/pages/login/backups1'
							})
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			},
			loginout() {
				this.show = true
			},
			lang(e){
				this.$i18n.locale = e;
				localStorage.setItem('lang',e);
				this.show2 = false;
			},
			openurl(e){
				if(e == 0){
					window.location.href = 'https://twitter.com/D__bucks'
				}else if(e == 1){
					window.location.href = 'https://accounts.google.com/v3/signin/identifier?dsh=S1090983466%3A1685427917675675&continue=https%3A%2F%2Faccounts.google.com%2Fb%2F0%2FAddMailService&followup=https%3A%2F%2Faccounts.google.com%2Fb%2F0%2FAddMailService&ifkv=Af_xneFVyvDyVEYw3tcatzgAyQXpYT3CuxQV___iRkQ5_Z2V2WZwzceoWDmaagDHPvgW8YTZnGnagw&passive=1209600&flowName=GlifWebSignIn&flowEntry=ServiceLogin'
				}else if(e == 2){
					window.location.href = 'https://m.youtube.com/channel/UCu5Lbl2-uLNsBtPXNCJ-Ebg'
				}else if(e == 3){
					window.location.href = 'https://www.google.com.hk/'
				}else if(e == 4){
					window.location.href = 'https://t.me/biworldwallet'
				}else{
					window.location.href = 'https://www.google.com.hk/'
				}
			},
			logout() {
				var url = domain + 'api/new_logout';
				var mytype = 'post';
				var userinfo = uni.getStorageSync('userinfo');
				uni.request({
					url,
					method: mytype,
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
						'Lang': uni.getStorageSync('lang'),
						'AUTHORIZATION': userinfo.token,
					},
					success: res => {
						if (res.data.code == 0) {
							localStorage.removeItem('token')
							localStorage.removeItem('userinfo')
							uni.showToast({
								icon: 'none',
								title: res.data.msg,
								success() {
									
								}
							});
						}
					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => {
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
					}
				});
			}
		}
	}
</script>

<style>
	.langBox {
		width: 52%;
		background-color: #fff;
		background-color: #ffffff;
		border-radius: 50rpx;
		padding: 10rpx 30rpx;
		font-size: 24rpx;
	}

	.langBox img {
		width: 44rpx;
		height: 44rpx;
		margin-right: 30rpx;
	}


	.langBox view {
		display: flex;
		align-items: center;
		margin: 20rpx;
	}


	.content {
		width: 65%;
		min-height: 100%;
		background-color: #ecf0f5;
		padding-top: 15rpx;
		padding-bottom: 80rpx;
		background-color: #ecf0f5;
		position: relative;
		z-index: 999;
		border-bottom-right-radius: 50rpx;
	}

	.list {
		display: flex;
		align-items: center;
		font-size: 24rpx;
		color: #222;
		margin-bottom: 26rpx;
		position: relative;
	}

	.list2 {
		font-size: 37rpx;
		color: #222;
		margin-bottom: 26rpx;
		position: relative;
	}

	.icon {
		height: 27px;
		    width: 27px;
		    margin: 7px 15px;
	}

	.title {
		width: 50%;
		font-weight: 600;
		font-size: 32rpx;
		color: #222;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.more {
		position: absolute;
		right: 30rpx;
		height: 32rpx;
		width: 32rpx;
	}

	/deep/ .u-popup__content {
		background-color: transparent;
	}

	.popupcon {
		width: 538rpx;
		height: 492rpx;
		border-radius: 50rpx;
		background-color: #fff;
	}

	.popupcon .icon {
		width: 176rpx;
		height: 176rpx;
		margin: 64rpx 180rpx;
	}

	.popupcon .titles {
		font-size: 32rpx;
		position: relative;
		float: none;
		line-height: normal;
		vertical-align: top;
		text-align: center;
		display: inline-block;
		margin: 0;
		padding: 0 20rpx;
		font-weight: 400;
		color: rgba(0, 0, 0, .64);
		width: 100%;
		overflow-wrap: break-word;
		box-sizing: border-box;
	}

	.btns {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		padding-right: 50rpx;
		margin-top: 20rpx;
	}

	.btn {
		background: #ccc;
		color: #555;
		border: none;
		box-shadow: none;
		border-radius: 10rpx;
		font-weight: 600;
		font-size: 28rpx;
		padding: 20rpx 48rpx;
		margin: 0;
		cursor: pointer;
	}
	
	.popupcon1{
		width: 538rpx;
		border-radius: 50rpx;
		padding: 50rpx;
		box-sizing: border-box;
		background-color: #fff;
	}
	
	.mask_title {
		width: 100%;
		text-align: center;
		margin-bottom: 40rpx;
	}
	
	.mask_btn {
		width: 100%;
		margin-top: 30rpx;
		height: 90rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.mask_btn view {
		flex: 1;
		height: 90rpx;
		text-align: center;
		line-height: 90rpx;
		margin: 0 10rpx;
		border-radius: 20rpx;
	}
	.mask_btn view:nth-child(1) {
		background-color: #ecf0f5;
		color: #7c7c7c;
	}
		
	.mask_btn view:nth-child(2) {
		background-color: #222222;
		color: #fff;
	}
</style>